<template>
	<view class="">
		<z-paging ref="paging" v-model="dataList" @query="queryList">
			<template #top>
				<view class="top pr">
					<image class="top-bg pa" src="/pagesA/static/images/bg.png" mode=""></image>

					<view class="top-box pa">
						<view class="top-box-top xflex-x-between">
							<view class="xflex-x">
								<view class="top-box-money">
									我的余额
								</view>
								<image class="top-box-icon" @click="info.show = !info.show" v-if=" info.show" src="/pagesA/static/images/by.png" mode=""></image>
								<image class="top-box-icon" @click="info.show = !info.show" v-if="!info.show" src="/pagesA/static/images/zy.png" mode=""></image>
							</view>
							<view class="top-box-btn" @click="topage('/pagesA/page/withdraw/withdraw')">
								提现
							</view>
						</view>

						<view class="top-price">
							<text>￥</text>{{info.show ? "****" : info.data.fund.money}}
						</view>

						<view class="top-balance xflex-x">
							<view class="top-balance-price xflex1">
								今日收益￥{{info.data.fund.today_profit}}
							</view>

							<view class="top-balance-price xflex1 ">
								已提现￥{{info.data.fund.total_cash}}
							</view>
						</view>
					</view>


				</view>

			</template>
			<view class="list">
				<view class="list-top">
					余额明细
				</view>

				<view class="list-item" v-for="(item,index) in dataList" :key="index">
					<view class="xflex-x-between xmb24">
						<view class="list-item-sn">
							{{item.remark}}
						</view>
						<view class="list-item-price">
							{{item.money}}
						</view>
					</view>

					<view class="xflex-x-between">
						<view class="list-item-time">
							{{item.createtime}}
						</view>
						<view class="list-item-time">
							余额：{{item.before}}
						</view>
					</view>
				</view>
			</view>

		</z-paging>
	</view>
</template>

<script setup>
	import {
		ref,
		reactive
	} from 'vue';
	import { onShow } from '@dcloudio/uni-app'
	import {
		partnercash,
		partnerinfo,
		partnermoneyLog
	} from '../../../network/home.js'


	let info = reactive({
		data: {
			address: "",
			bank: [],
			default: [],
			fund: {
				money: "0.00",
				today_order: 0,
				today_profit: 0,
				total_order: 0,
				total_profit: 0,
				total_trade: 0,
				yesterday_order: 0,
			},
			id: 2,
			image: "",
			name: "",
			show: false
		}
	})
	// 获取个人信息
	const getpartner = () => {
		partnerinfo().then(res => {
			info.data = res.data
		})
	}



	const paging = ref(null)
	// v-model绑定的这个变量不要在分页请求结束中自己赋值，直接使用即可
	const dataList = ref([])
	const queryList = (pageNo, pageSize) => {
		// 此处请求仅为演示，请替换为自己项目中的请求
		partnermoneyLog({
			page_no: pageNo,
			page_size: pageSize
		}).then(res => {
			dataList.value.push(...res.data.lists)
		}).catch(res => {
			// 如果请求失败写paging.value.complete(false);
			// 注意，每次都需要在catch中写这句话很麻烦，z-paging提供了方案可以全局统一处理
			// 在底层的网络请求抛出异常时，写uni.$emit('z-paging-error-emit');即可
			paging.value.complete(false);
		})
	}
	const topage = (url) => {
		uni.navigateTo({
			url: url
		})
	}
	
	
	onShow(()=>{
		getpartner()
	})
	
</script>

<style>
	page {
		background-color: #f5f5f5;
	}
</style>

<style lang="scss" scoped>
	.top {
		width: 700rpx;
		height: 300rpx;
		margin: 26rpx auto;

		&-bg {
			width: 100%;
			height: 100%;
		}

		&-box {
			z-index: 1;
			width: 100%;
			height: 100%;

			&-top {
				padding: 40rpx 36rpx;
			}

			&-icon {
				width: 30rpx;
				height: 30rpx;
				margin-left: 20rpx;
			}

			&-money {
				font-family: PingFang SC;
				font-weight: bold;
				font-size: 32rpx;
				color: #EAE9EF;
			}

			&-btn {
				width: 120rpx;
				height: 52rpx;
				border-radius: 10rpx;
				border: 2px solid #FFFFFF;

				font-family: PingFang SC;
				font-weight: 500;
				font-size: 24rpx;
				color: #FFFFFF;

				text-align: center;
				line-height: 52rpx;
			}
		}

		&-price {
			font-family: PingFang SC;
			font-weight: bold;
			font-size: 32rpx;
			color: #FFFFFF;
			padding: 0 36rpx;
			margin-bottom: 70rpx;
		}

		&-balance {
			margin-left: 35rpx;

			&-price {
				font-family: PingFang SC;
				font-weight: 500;
				font-size: 24rpx;
				color: #FFFFFF;

			}
		}
	}

	.list {
		width: 700rpx;
		min-height: 1000rpx;
		margin: auto;
		background: #FFFFFF;
		border-radius: 20rpx 0;
		padding: 32rpx;
		box-sizing: border-box;

		&-top {
			font-family: PingFang SC;
			font-weight: bold;
			font-size: 30rpx;
			color: #333333;
		}

		&-item {
			padding: 30rpx 0 20rpx 0;
			border-bottom: 1rpx solid #EEEEEE;

			&-sn {
				font-family: PingFang SC;
				font-weight: 500;
				font-size: 28rpx;
				color: #333333;
			}

			&-price {
				font-family: PingFang SC;
				font-weight: bold;
				font-size: 36rpx;
				color: #333333;
			}

			&-time {
				font-family: PingFang SC;
				font-weight: 500;
				font-size: 22rpx;
				color: #999999;
			}

			&-money {}
		}
	}
</style>